<template>
  <div>
    <codemirror v-model="code" :options="cmOptions"></codemirror>
  </div>
</template>
<script>
// require component
import { codemirror } from 'vue-codemirror'

// require styles
import 'codemirror/lib/codemirror.css'

  export default {
    components: {
      codemirror
    },
    props: {
      platform: null
    },
    data() {
      return {
        code: 'groups:                                      \n' +
          '- name: hooPlatfomrAlert                     \n' +
          '  rules:                                     \n' +
          '  - alert: hooKlineLostAlert                 \n' +
          '    expr: hoo_kline_5vol_total < 100         \n' +
          '    for: 5m                                  \n' +
          '    annotations:                             \n' +
          '      summary: "[云鲲]虎符mdu交易无量报警"             \n' +
          '      description: "持续5分钟交易量低于100"           \n' +
          '  - alert: hooKlineLast2PriceEqAlert         \n' +
          '    expr: hoo_price_last2_eq == 1            \n' +
          '    for: 12m                                 \n' +
          '    annotations:                             \n' +
          '      summary: "[云鲲]虎符mdu价格持续不变报警"           \n' +
          '      description: "持续12分钟最后两根5min收盘价相等"     ',
        cmOptions: {
          // codemirror options
          tabSize: 4,
          mode: 'text/x-yaml',
          // theme: 'abcdef',
          theme: 'base16-dark',
          lineNumbers: true,
          line: true,
          // more codemirror options, 更多 codemirror 的高级配置...
        }
      }
    },
    computed: {},
    watch: {},
    created() {
    },
    mounted() {
      console.log('this is current codemirror object', this.codemirror)
    },
    methods: {


    }
  }

</script>
<style>
</style>
